import { NavController, Platform } from '@ionic/angular';
// import { ModalsService } from './../../service/modals/modals.service';
import { QRScanner, QRScannerStatus } from '@ionic-native/qr-scanner/ngx';
import { Component, OnDestroy, ElementRef } from '@angular/core';
// import { ComponentsServiceService } from './../../service/componentsService/components-service.service';

@Component({
  selector: 'app-qrscanner',
  templateUrl: './qrscanner.page.html',
  styleUrls: ['./qrscanner.page.scss'],
})
export class QrscannerPage {
  lightIcon: string;
  light: boolean;
  frontCamera: boolean;
  scannerClass: boolean;
  constructor(
    private platform: Platform,
    private scanner: QRScanner,
    private router: NavController,
    // private modal: ModalsService,
    private element: ElementRef,
    // private messageService: ComponentsServiceService,
  ) {
    this.lightIcon = 'flash-off';
    // this.modal.showLoading();
  }
  ionViewDidEnter() {
    // this.modal.hideLoading();
    this.scannerClass = true;
    this.startScanner();
    this.scanner.show();
  }

  ngOnDestroy() {
    this.scannerClass = false;
    this.destroyScanner();
  }

  closeModal() {
    this.router.back();
    this.destroyScanner();
  }

  toogleLight() {
    this.light = !this.light;

    if (this.light) {
      this.lightIcon = 'flash';
      this.scanner.enableLight();
    } else {
      this.lightIcon = 'flash-off';
      this.scanner.disableLight();
    }
  }

  toggleCamera() {
    this.frontCamera = !this.frontCamera;
    if (this.frontCamera) {
      this.scanner.useFrontCamera();
    } else {
      this.scanner.useBackCamera();
    }
  }

  startScanner() {
    this.platform.ready().then(() => {
      this.scanner.destroy();
      // Optionally request the permission early
      this.scanner.prepare().then((status: QRScannerStatus) => {
        if (status.authorized) {
          // camera permission was granted
          // start scanning
          let scanSub = this.scanner.scan().subscribe((text: string) => {
            console.log(text);

            // this.messageService.sendEvents({ type: 'scanner', data: text });
            alert(text);
            this.scanner.hide(); // hide camera preview
            scanSub.unsubscribe(); // stop scanning
            this.router.back();
          });

        } else if (status.denied) {
          this.scanner.openSettings();
          // camera permission was permanently denied
          // you must use QRScanner.openSettings() method to guide the user to the settings page
          // then they can grant the permission from there
        } else {
          // permission was denied, but not permanently. You can ask for permission again at a later time.
        }
      }).catch((e: any) => {
        // this.modal.toast(e)
      }
      )
        ;
    });
  }

  destroyScanner() {
    this.scanner.destroy();
    // 这里延迟一秒将html背景色重新设置为白色，否则会变透明，影响视觉效果
    setTimeout(() => {
      (window.document.querySelector('html') as HTMLElement).style.backgroundColor = '#fff';
    }, 1000);
  }
}




